
/**
 * @description 章节
 * @returns 
 */

import AbIcon from "@/components/DecorateIcons/Ab_Icon"
const freeData = {
  chnTotal: '二',
  list: [
    {
      id: "1",
      chaptertitle: "第一章"
    },
    {
      id: "2",
      chaptertitle: "第二章"
    },
  ]
}
const vipData = {
  chnTotal: '六',
  list: [
    {
      id: "3",
      chaptertitle: "第三章"
    },
    {
      id: "4",
      chaptertitle: "第四章"
    },
    {
      id: "5",
      chaptertitle: "第五章"
    },
    {
      id: "6",
      chaptertitle: "第六章"
    },
    {
      id: "7",
      chaptertitle: "第七章"
    },
    {
      id: "8",
      chaptertitle: "第八章"
    }
  ]
}


function ChapterTab() {
  return (
    <div className="chapter">

      {/* 免费 */}
      <div className="title" >正文卷·共 {freeData.chnTotal} 章(免费)</div>

      <div className="list-box" >
        {
          freeData.list.map(item => (
            <div key={item.id} className="item">
              <span className="text">{item.chaptertitle}</span>
            </div>
          ))
        }
      </div>

      {/* vip */}
      <div className="title" >正文卷·共 {vipData.chnTotal} 章(VIP)</div>
      <div className="list-box" >
        {
          vipData.list.map(item => (
            <div key={item.id} className="item">
              <span className="text">{item.chaptertitle}</span>
              <AbIcon className='icon' iconName='LockOutlined' />
            </div>
          ))
        }
      </div>

    </div >
  )
}
export default ChapterTab